/**
 * Created by Thyiad on 2018/5/9.
 */
let chartConfig = {
  getConfig(legend, xAxis, data, colors){

    let series = legend.map((item, index)=>{
      return {
        name: item,
        type: 'bar',
        borderRadius: 3,
        barWidth: 10,
        barGap: '40%',
        data: data[index],
        itemStyle: {
          normal: {
            color: colors[index],
          }
        },
      };
    })

      return {
        title: {
          show: false,
        },
        tooltip: {},
        legend: {
          show: true,
          data: legend,
          itemGap: 10,
          icon: 'circle',
          align: 'left',
          right: '0',
          itemWidth: 8,
          itemHeight: 8,
          textStyle:{
            color: 'white',
            fontSize: 9,
          }
        },
        xAxis: {
          type: 'category',
          data: xAxis,
          axisLabel:{
            textStyle: {
              color: "#fff",
              fontSize: 10,
            }
          }
        },
        yAxis: {
          type:'value',
          axisLabel: {
            textStyle:{
              color: '#fff',
              fontSize: 10,
            }
          }
        },
        series: series,
      }
  },

  getConfigHcharts(legend, xAxis, data, colors){

    let series = legend.map((item, index)=>{
      return {
        name: item,
        data: data[index],
      };
    })

    return {
      chart: {
        type: 'column',
        backgroundColor:'transparent',
      },
      colors:colors,
      legend:{
        enabled: false,
        align:'right',
        verticalAlign:'top',
        x:0,
        y:0,
        itemStyle:{
          color:'white',
          fontSize: '8px',
          fontWeight: 'normal',
          textOutline:"none"
        },
      },
      credits: {
        enabled:false
      },
      title: {
        text: null
      },
      subtitle: {
        text: null
      },
      xAxis: {
        categories: xAxis,
        crosshair: true,
        labels:{
          style:{
            color: '#fff',
            fontSize: '10px',
          }
        }
      },
      yAxis: {
        min: 0,
        tickPixelInterval: 16,
        title: {
          text: null
        },
        labels:{
          style:{
            color: '#fff',
            textOutline:"none"
          }
        }
      },
      plotOptions: {
        series: {
          borderRadius: 3
        }
      },
      tooltip: {
        // head + 每个 point + footer 拼接成完整的 table
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
        pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
        '<td style="padding:0"><b>{point.y:.1f}</b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true
      },
      plotOptions: {
        column: {
          borderWidth: 0
        }
      },
      series: series
    }
  },
}

export default chartConfig;
